<template>
  <div id="box">
      <div class="tab">

        <span class="li-tab" v-for="(item,index) in tabsParam"
        @click="toggleTabs(index)"
        :class="[{cur:nowIndex==index}]">{{item}}
      </span>
      </div>
      <div class="content">
        <shang v-show="nowIndex==0"></shang>
        <jin v-show="nowIndex==1"></jin>
        <over v-show="nowIndex==2"></over>
      </div>
  </div>
</template>
<script>
import shang from "@/components/eight/list/shang"      //广告管理待上架
import jin from "@/components/eight/list/jin"          //广告管理进行中
import over from "@/components/eight/list/over"        //广告管理已结束
export default {
  name: 'newCreate',
  components:{
    'shang': function(resolve) {
        require(['@/components/eight/list/shang.vue'], resolve);
    },
    'jin': function(resolve) {
        require(['@/components/eight/list/jin.vue'], resolve);
    },
    'over': function(resolve) {
        require(['@/components/eight/list/over.vue'], resolve);
    }
  },
  data() {
    return{
      tabsParam:['待上架','进行中','已结束'],
      nowIndex:'',
      isShow:false
    }
  },
  created() {
    //do something after creating vue instance
    this.getData()
  },
  methods:{
    //切换tab项
    toggleTabs(index){
      this.nowIndex = index;
      //$(window).resize();
    },
    getData(){
      var url='http://dev.hybrid.u76ho.com/#/eight?userid=1';
      var obj={
        types:this.$route.query.types
      }
      this.nowIndex=obj.types
    //  alert(this.nowIndex)
      var thet=this;
      this.$axios.post(url,obj).then(response=>{
          thet.arr=response.data.data
          //console.log(thet.arr)
      })
      .catch(function(error) {
          console.log(error);
      });
    }
  }
}
</script>
<style lang="scss" scoped>
.cur{
  color:#44DCC3;
}
#box{
  width:100%;
  height:100%;
  position:fixed;
  background: rgb(247,247,247);
}

.tab{
  width:100%;
  height:0.32rem;
  background: #FFFFFF;
  display:flex;
  justify-content:space-around;
  align-items:center;
  // position:fixed;
  // top:0.64rem;
  color:#636363;
  font-size:0.14rem;
}

.content{
  width:100%;
  height:100%;
  display:flex;
  justify-content: center;
  overflow-y: scroll;
  overflow-x: hidden;
  // position: fixed;
  // top:0.96rem;
}
</style>
